
import React from "react";
import { ModelDetail as ModelInfoType } from "../../../core/types/ollama";
import { ModelInfo } from "./ModelInfo";
import styles from "./ModelInfoSection.module.css";

interface ModelInfoSectionProps {
    model: ModelInfoType | null;
    loading?: boolean;
    error?: string | null;
}

export const ModelInfoSection: React.FC<ModelInfoSectionProps> = ({ 
    model, 
    loading = false, 
    error = null 
}) => {
    if (!model) return null;
    
    return (
        <div className={styles.container}>
            {/* 标题区域 */}
            <div className={styles.header}>
                <h3>模型信息</h3>
                {loading && <span className={styles.loading}>加载中...</span>}
                {error && <span className={styles.error}>{error}</span>}
            </div>
            
            {/* 内容区域 */}
            <div className={styles.content}>
                <ModelInfo />
            </div>
        </div>
    );
};